<template>
	<view class="tagsNav">
		<u-tabs @click="selected"
			:list="!list || list.length == 0? nav : list"
			:key-name="keyName"
			:current="ofSelected"
			lineColor="red"
			:activeStyle="{
				fontWeight: 'bold',
				color: '#000'
			}"
		></u-tabs>
	</view>
</template>

<script>
	export default {
		name: 'tagsNav',
		props: {
			list: {
				type: Array,
				default: () => []
			},
			keyName: {
				type: String,
				default: "name"
			},
			ofSelected: {
				type: Number,
				default: 1
			}
		},
		data() {
			return {
				nav: [{
					name: '关注',
					id: 1
				}, {
					name: '推荐',
					id: 2
				}, {
					name: '电影',
					id: 3
				}, {
					name: '科技',
					id: 4
				}, {
					name: '音乐',
					id: 5
				}, {
					name: '美食',
					id: 6
				}, {
					name: '文化',
					id: 7
				}, {
					name: '财经',
					id: 8
				}, {
					name: '手工',
					id: 9
				}]
			}
		},
		mounted() {
			
		},
		methods: {
			selected(item) {
				this.$emit('tagSelect', item);
			}
		}
	}
</script>

<style lang="scss" scoped>
.tagsNav{
	::-webkit-scrollbar {
		display: none;
	}
}	
</style>